JavaScript Programming - Full Course

freeCodeCamp.org
7.51M subscribers
Remarkable content ❤ For those interested in learning Javascript... books can also be amazing sources. These are the best: Eloquent Javascript Javascript in Less Than 50 Pages Head First Javascript Programming You`re welcome
2.2K
Knowing the basics of Python made this course just fly by. It true that when you learn one language, learning another is just the different syntax. The concepts are mostly same. Good luck to the new programmers. Just dont give up
1.6K
03:41 Passenger counter app 04:39 Setting up file 07:42 Create variable 12:27 Mathematical operations 16:16 Reassigning & incrementing 19:23 Adding button 21:41 onclick event listener 25:10 Using functions to write less code 28:48 First function 29:34 Function that logs sum 32:25 Function that increments 34:23 Increment on clicks 36:35 Display count 41:53 Document Object Model 43:47 Display count w/ innerText 44:30 Create save button 46:40 What is string? 48:16 First string variable 52:00 Log greeting to console 53:18 Strings vs. Numbers 56:07 Render welcome message 58:10 Improve message w/ string concatenation 1:00:28 Use plus equal for count 1:00:57 Create save feature 1:05:38 Debugging online 1:09:31 Set count to 0 1:12:28 Recap 1:15:47 Variables practice 1:17:42 Concatenate strings 1:18:43 Incrementing & decrementing 1:20:56 Strings & numbers 1:22:35 Rendering error message 1:25:52 Calculator challenge ​ Build Blackjack Game 1:31:27 Build Blackjack game 1:32:27 Add firstCard, secondCard, & sum 1:33:23 If...else conditionals 1:39:08 if...else statement 1:42:05 if/else...if/else statement 1:45:28 if...else statement for our game 1:47:32 hasBlackJack variable 1:49:38 isAlive variable 1:51:27 Practice boolean conditions 1:54:55 Add message variable 1:58:20 Link stylesheet 2:00:56 Add basic styling 2:05:19 Make start button work 2:11:13 Display message 2:13:48 Display sum 2:19:36 Display cards 2:21:34 New card button 2:25:16 Add to sum when newCard is clicked 2:28:36 Rename startGame function 2:30:52 Solving our cards problem w/ array 2:34:12 Arrays intro 2:39:30 Array indexes 2:43:50 Arrays w/ multiple data types 2:46:12 Adding & removing items from arrays 2:50:35 Creating cards array 2:51:43 Push new card to array 2:53:05 Counting 2:57:10 Loops 3:00:37 For loops & arrays 3:04:23 First array-based for loop 3:05:55 For loops, arrays, & DOM 3:08:55 Use loop to render cards 3:11:16 Avoid hard-coding values 3:12:51 Returning values 3:17:54 Use function to set card values 3:21:05 Generating random numbers w/ Math.random() 3:25:24 Math.random() * 6 3:27:11 Flooring number w/ Math.floor() 3:28:40 Create dice 3:30:23 Completing dice function 3:33:04 Make getRandomCard() work 3:36:00 getRandomNumber function 3:39:06 Assign values in startGame function 3:41:52 Card feature is broken 3:42:54 Logical AND operator 3:46:39 Logical operators 3:48:47 logical OR operator 3:51:52 Only trigger newCard() if you're allowed to 3:53:23 Object sneak peek 3:58:02 Objects 4:02:47 Create first object 4:06:08 Store player data 4:08:48 Methods on object 4:10:50 Recap 4:15:17 Objects & functions 4:17:21 if else 4:20:13 Loops & arrays 4:22:21 push, pop, unshift, shift challenge 4:25:50 Logical operators 4:27:50 Rock papers scissors 4:30:52 Sorting fruits Build Chrome Extension 4:33:54 Build Chrome Extension 4:38:30 Add button & input tag 4:40:06 Style button & input tag 4:47:28 Make input button work w/ onclick 4:48:49 Refactor to addEventListener 4:51:11 addEventListener() 4:52:58 Refactoring 4:54:25 Create myLeads array & inputEl 4:56:49 Using let & const 5:00:11 Push to myLeads array 5:01:24 Push value from input field 5:03:56 Use for loop to log out leads 5:05:38 Create unordered list 5:07:39 Render leads in unordered list 5:11:22 How to render li elements w/ innerHTML 5:13:01 innerHTML 5:14:34 More innerHTML practice 5:16:26 Render li elements w/ innerHTML 5:17:37 Use createElement() & append() instead of innerHTML 5:21:16 Improving performance of our app 5:24:37 Create render function 5:26:40 Clear input field 5:28:47 Add a tag 5:35:53 Template strings 5:35:54 Write template string 5:36:28 Make template string more dynamic 5:37:12 Template strings on multiple lines 5:41:03 Refactor app to use template string 5:42:19 Style list 5:46:13 Preparing deployment 5:51:08 Deploying Chrome Extension 5:53:40 What is localStorage? 5:56:45 First localStorage 6:00:38 Storing arrays in localStorage 6:07:05 Save leads 6:09:36 Get leads 6:13:31 Truthy & falsy values 6:21:28 Guess expression: truthy or falsy? 6:23:52 Checking localStorage before rendering 6:27:33 Style delete button 6:30:52 Make delete button work 6:35:12 How function parameters can improve our code 6:41:09 Write function parameter 6:44:40 Functions w/ multiple params 6:47:54 Numbers as function params 6:49:40 Arguments vs Params 6:53:06 Arrays as params 6:55:02 Refactor renderLeads() to use parameter 6:56:46 Create tabBtn 7:00:07 Save tab url 7:02:46 Get current tab 7:07:09 Use Chrome API to get tab 7:13:32 Deploy final version 7:15:48 Recap 7:21:34 Practice 7:41:55 Outro
105
I remember the days when i have no idea what is all this . I have no idea what is id, class, objects and all. I felt overwhelmed but after consistent learning and practices ,now i am able to create websites and make it interactive. Never felt more happier. To all those new beginners don't lose hope. Keep practicing it improves muscle memory. So, Don't give up.
233
3 days after its release, this video was my introduction to web development. 2 weeks ago I started my first job as a full stack developer. Work hard and never give up!
756
00:00 Intro 03:41 Passenger counter app 04:39 Setting up file 07:42 Create variable 12:27 Mathematical operations 16:16 Reassigning & incrementing 19:23 Adding button 21:41 on click event listener 25:10 Using functions to write less code 28:48 First function 29:34 Function that logs sum 32:25 Function that increments 34:23 Increment on clicks 36:35 Display count 41:53 Document Object Model 43:47 Display count w/ innerText 44:30 Create save button 46:40 What is a string? 48:16 First string variable 52:00 Log greeting to console 53:18 Strings vs. Numbers 56:07 Render welcome message 58:10 Improve message w/ string concatenation 1:00:28 Use plus equal for count 1:00:57 Create save feature 1:05:38 Debugging online 1:09:31 Set count to 0 1:12:28 Recap 1:15:47 Variables practice 1:17:42 Concatenate strings 1:18:43 Incrementing & decrementing 1:20:56 Strings & numbers 1:22:35 Rendering error message 1:25:52 Calculator challenge ​ Build Blackjack Game 1:31:27 Build Blackjack game 1:32:27 Add firstCard, secondCard, & sum 1:33:23 If...else conditionals 1:39:08 if...else statement 1:42:05 if/else...if/else statement 1:45:28 if...else statement for our game 1:47:32 hasBlackJack variable 1:49:38 isAlive variable 1:51:27 Practice boolean conditions 1:54:55 Add message variable 1:58:20 Link stylesheet 2:00:56 Add basic styling 2:05:19 Make start button work 2:11:13 Display message 2:13:48 Display sum 2:19:36 Display cards 2:21:34 New card button 2:25:16 Add to sum when newCard is clicked 2:28:36 Rename startGame function 2:30:52 Solving our cards problem w/ array 2:34:12 Arrays intro 2:39:30 Array indexes 2:43:50 Arrays w/ multiple data types 2:46:12 Adding & removing items from arrays 2:50:35 Creating cards array 2:51:43 Push new card to array 2:53:05 Counting 2:57:10 Loops 3:00:37 For loops & arrays 3:04:23 First array-based for loop 3:05:55 For loops, arrays, & DOM 3:08:55 Use loop to render cards 3:11:16 Avoid hard-coding values 3:12:51 Returning values 3:17:54 Use function to set card values 3:21:05 Generating random numbers w/ Math.random() 3:25:24 Math.random() * 6 3:27:11 Flooring number w/ Math.floor() 3:28:40 Create dice 3:30:23 Completing dice function 3:33:04 Make getRandomCard() work 3:36:00 getRandomNumber function 3:39:06 Assign values in startGame function 3:41:52 Card feature is broken 3:42:54 Logical AND operator 3:46:39 Logical operators 3:48:47 logical OR operator 3:51:52 Only trigger newCard() if you're allowed to 3:53:23 Object sneak peek 3:58:02 Objects 4:02:47 Create first object 4:06:08 Store player data 4:08:48 Methods on object 4:10:50 Recap 4:15:17 Objects & functions 4:17:21 if else 4:20:13 Loops & arrays 4:22:21 push, pop, unshift, shift challenge 4:25:50 Logical operators 4:27:50 Rock papers scissors 4:30:52 Sorting fruits Build Chrome Extension 4:33:54 Build Chrome Extension 4:38:30 Add button & input tag 4:40:06 Style button & input tag 4:47:28 Make input button work w/ onclick 4:48:49 Refactor to addEventListener 4:51:11 addEventListener() 4:52:58 Refactoring 4:54:25 Create myLeads array & inputEl 4:56:49 Using let & const 5:00:11 Push to myLeads array 5:01:24 Push value from input field 5:03:56 Use for loop to log out leads 5:05:38 Create unordered list 5:07:39 Render leads in unordered list 5:11:22 How to render li elements w/ innerHTML 5:13:01 innerHTML 5:14:34 More innerHTML practice 5:16:26 Render li elements w/ innerHTML 5:17:37 Use createElement() & append() instead of innerHTML 5:21:16 Improving performance of our app 5:24:37 Create render function 5:26:40 Clear input field 5:28:47 Add a tag 5:35:53 Template strings 5:35:54 Write template string 5:36:28 Make template string more dynamic 5:37:12 Template strings on multiple lines 5:41:03 Refactor app to use template string 5:42:19 Style list 5:46:13 Preparing deployment 5:51:08 Deploying Chrome Extension 5:53:40 What is localStorage? 5:56:45 First localStorage 6:00:38 Storing arrays in localStorage 6:07:05 Save leads 6:09:36 Get leads 6:13:31 Truthy & falsy values 6:21:28 Guess expression: truthy or falsy? 6:23:52 Checking localStorage before rendering 6:27:33 Style delete button 6:30:52 Make delete button work 6:35:12 How function parameters can improve our code 6:41:09 Write function parameter 6:44:40 Functions w/ multiple params 6:47:54 Numbers as function params 6:49:40 Arguments vs Params 6:53:06 Arrays as params 6:55:02 Refactor renderLeads() to use parameter 6:56:46 Create tabBtn 7:00:07 Save tab url 7:02:46 Get current tab 7:07:09 Use Chrome API to get tab 7:13:32 Deploy final version 7:15:48 Recap 7:21:34 Practice 7:41:55 Outro
13
TIMESTAMPS: 00:00 Intro 03:41 Passenger counter app 04:39 Setting up file 07:42 Create variable 12:27 Mathematical operations 16:16 Reassigning & incrementing 19:23 Adding button 21:41 onclick event listener 25:10 Using functions to write less code 28:48 First function 29:34 Function that logs sum 32:25 Function that increments 34:23 Increment on clicks 36:35 Display count 41:53 Document Object Model 43:47 Display count w/ innerText 44:30 Create save button 46:40 What is string? 48:16 First string variable 52:00 Log greeting to console 53:18 Strings vs. Numbers 56:07 Render welcome message 58:10 Improve message w/ string concatenation 1:00:28 Use plus equal for count 1:00:57 Create save feature 1:05:38 Debugging online 1:09:31 Set count to 0 1:12:28 Recap 1:15:47 Variables practice 1:17:42 Concatenate strings 1:18:43 Incrementing & decrementing 1:20:56 Strings & numbers 1:22:35 Rendering error message 1:25:52 Calculator challenge ​ Build Blackjack Game 1:31:27 Build Blackjack game 1:32:27 Add firstCard, secondCard, & sum 1:33:23 If...else conditionals 1:39:08 if...else statement 1:42:05 if/else...if/else statement 1:45:28 if...else statement for our game 1:47:32 hasBlackJack variable 1:49:38 isAlive variable 1:51:27 Practice boolean conditions 1:54:55 Add message variable 1:58:20 Link stylesheet 2:00:56 Add basic styling 2:05:19 Make start button work 2:11:13 Display message 2:13:48 Display sum 2:19:36 Display cards 2:21:34 New card button 2:25:16 Add to sum when newCard is clicked 2:28:36 Rename startGame function 2:30:52 Solving our cards problem w/ array 2:34:12 Arrays intro 2:39:30 Array indexes 2:43:50 Arrays w/ multiple data types 2:46:12 Adding & removing items from arrays 2:50:35 Creating cards array 2:51:43 Push new card to array 2:53:05 Counting 2:57:10 Loops 3:00:37 For loops & arrays 3:04:23 First array-based for loop 3:05:55 For loops, arrays, & DOM 3:08:55 Use loop to render cards 3:11:16 Avoid hard-coding values 3:12:51 Returning values 3:17:54 Use function to set card values 3:21:05 Generating random numbers w/ Math.random() 3:25:24 Math.random() * 6 3:27:11 Flooring number w/ Math.floor() 3:28:40 Create dice 3:30:23 Completing dice function 3:33:04 Make getRandomCard() work 3:36:00 getRandomNumber function 3:39:06 Assign values in startGame function 3:41:52 Card feature is broken 3:42:54 Logical AND operator 3:46:39 Logical operators 3:48:47 logical OR operator 3:51:52 Only trigger newCard() if you're allowed to 3:53:23 Object sneak peek 3:58:02 Objects 4:02:47 Create first object 4:06:08 Store player data 4:08:48 Methods on object 4:10:50 Recap 4:15:17 Objects & functions 4:17:21 if else 4:20:13 Loops & arrays 4:22:21 push, pop, unshift, shift challenge 4:25:50 Logical operators 4:27:50 Rock papers scissors 4:30:52 Sorting fruits Build Chrome Extension 4:33:54 Build Chrome Extension 4:38:30 Add button & input tag 4:40:06 Style button & input tag 4:47:28 Make input button work w/ onclick 4:48:49 Refactor to addEventListener 4:51:11 addEventListener() 4:52:58 Refactoring 4:54:25 Create myLeads array & inputEl 4:56:49 Using let & const 5:00:11 Push to myLeads array 5:01:24 Push value from input field 5:03:56 Use for loop to log out leads 5:05:38 Create unordered list 5:07:39 Render leads in unordered list 5:11:22 How to render li elements w/ innerHTML 5:13:01 innerHTML 5:14:34 More innerHTML practice 5:16:26 Render li elements w/ innerHTML 5:17:37 Use createElement() & append() instead of innerHTML 5:21:16 Improving performance of our app 5:24:37 Create render function 5:26:40 Clear input field 5:28:47 Add a tag 5:35:53 Template strings 5:35:54 Write template string 5:36:28 Make template string more dynamic 5:37:12 Template strings on multiple lines 5:41:03 Refactor app to use template string 5:42:19 Style list 5:46:13 Preparing deployment 5:51:08 Deploying Chrome Extension 5:53:40 What is localStorage? 5:56:45 First localStorage 6:00:38 Storing arrays in localStorage 6:07:05 Save leads 6:09:36 Get leads 6:13:31 Truthy & falsy values 6:21:28 Guess expression: truthy or falsy? 6:23:52 Checking localStorage before rendering 6:27:33 Style delete button 6:30:52 Make delete button work 6:35:12 How function parameters can improve our code 6:41:09 Write function parameter 6:44:40 Functions w/ multiple params 6:47:54 Numbers as function params 6:49:40 Arguments vs Params 6:53:06 Arrays as params 6:55:02 Refactor renderLeads() to use parameter 6:56:46 Create tabBtn 7:00:07 Save tab url 7:02:46 Get current tab 7:07:09 Use Chrome API to get tab 7:13:32 Deploy final version 7:15:48 Recap 7:21:34 Practice 7:41:55 Outro
605
The instructor for this lesson is one of the best I've come across so far. His video is as engaging as it can be to hold my attention, and lots of hands on practice. Excellent 🙂👍
183
Beauty of this course is the teacher (Mr. Per) considers the student (us) are actually novice programmers. Rather than throwing us to the fire, he teaches JS step by step in a viewer friendly, interactive, non-boring manner. Ex: He does not jump in to using dreaded "arrow functions" which often confuse novice programmers. Keep the good work up good sir and I bid you good luck for all your endeavors. 💪
80
Even paid courses don't provide the amount of knowledge you're providing for free. You're great Sir. 🌟🌟🌟🌟
34
I'm a computer Science student in college and this has been one of the only ways I've been able to learn. They really just give you a book filled with code and hope that you get the gist. It's been so hard trying to grasp everything they throw at you without even giving practical examples. I'm not even thirty mins into this video, and it has helped me more than any college class has.
17
The biggest problem with coding tutorials is they are not engaging enough. But I have rarely seen tutorial as engaging as this one. Too good :)
39
This is the most amazing JS course out there. Honestly, worth every minute. It took me a week to finish it. Thank you people for putting this for everyone to learn.
99
Some people are good at coding. Others are good at teaching. Finding a good coder who can combine that with good teaching is a priceless commodity. The fact that this level of vocational education is FREE in this day and age is nothing short of a blessing. Thank you so much!
69
Don't mind me, just pinning the timestamp for myself TIMESTAMPS: 00:00 Intro 03:41 Passenger counter app 04:39 Setting up file 07:42 Create variable 12:27 Mathematical operations 16:16 Reassigning & incrementing 19:23 Adding button 21:41 onclick event listener 25:10 Using functions to write less code 28:48 First function 29:34 Function that logs sum 32:25 Function that increments 34:23 Increment on clicks 36:35 Display count 41:53 Document Object Model 43:47 Display count w/ innerText 44:30 Create save button 46:40 What is string? 48:16 First string variable 52:00 Log greeting to console 53:18 Strings vs. Numbers 56:07 Render welcome message 58:10 Improve message w/ string concatenation 1:00:28 Use plus equal for count 1:00:57 Create save feature 1:05:38 Debugging online 1:09:31 Set count to 0 1:12:28 Recap 1:15:47 Variables practice 1:17:42 Concatenate strings 1:18:43 Incrementing & decrementing 1:20:56 Strings & numbers 1:22:35 Rendering error message 1:25:52 Calculator challenge ​ Build Blackjack Game 1:31:27 Build Blackjack game 1:32:27 Add firstCard, secondCard, & sum 1:33:23 If...else conditionals 1:39:08 if...else statement 1:42:05 if/else...if/else statement 1:45:28 if...else statement for our game 1:47:32 hasBlackJack variable 1:49:38 isAlive variable 1:51:27 Practice boolean conditions 1:54:55 Add message variable 1:58:20 Link stylesheet 2:00:56 Add basic styling 2:05:19 Make start button work 2:11:13 Display message 2:13:48 Display sum 2:19:36 Display cards 2:21:34 New card button 2:25:16 Add to sum when newCard is clicked 2:28:36 Rename startGame function 2:30:52 Solving our cards problem w/ array 2:34:12 Arrays intro 2:39:30 Array indexes 2:43:50 Arrays w/ multiple data types 2:46:12 Adding & removing items from arrays 2:50:35 Creating cards array 2:51:43 Push new card to array 2:53:05 Counting 2:57:10 Loops 3:00:37 For loops & arrays 3:04:23 First array-based for loop 3:05:55 For loops, arrays, & DOM 3:08:55 Use loop to render cards 3:11:16 Avoid hard-coding values 3:12:51 Returning values 3:17:54 Use function to set card values 3:21:05 Generating random numbers w/ Math.random() 3:25:24 Math.random() * 6 3:27:11 Flooring number w/ Math.floor() 3:28:40 Create dice 3:30:23 Completing dice function 3:33:04 Make getRandomCard() work 3:36:00 getRandomNumber function 3:39:06 Assign values in startGame function 3:41:52 Card feature is broken 3:42:54 Logical AND operator 3:46:39 Logical operators 3:48:47 logical OR operator 3:51:52 Only trigger newCard() if you're allowed to 3:53:23 Object sneak peek 3:58:02 Objects 4:02:47 Create first object 4:06:08 Store player data 4:08:48 Methods on object 4:10:50 Recap 4:15:17 Objects & functions 4:17:21 if else 4:20:13 Loops & arrays 4:22:21 push, pop, unshift, shift challenge 4:25:50 Logical operators 4:27:50 Rock papers scissors 4:30:52 Sorting fruits Build Chrome Extension 4:33:54 Build Chrome Extension 4:38:30 Add button & input tag 4:40:06 Style button & input tag 4:47:28 Make input button work w/ onclick 4:48:49 Refactor to addEventListener 4:51:11 addEventListener() 4:52:58 Refactoring 4:54:25 Create myLeads array & inputEl 4:56:49 Using let & const 5:00:11 Push to myLeads array 5:01:24 Push value from input field 5:03:56 Use for loop to log out leads 5:05:38 Create unordered list 5:07:39 Render leads in unordered list 5:11:22 How to render li elements w/ innerHTML 5:13:01 innerHTML 5:14:34 More innerHTML practice 5:16:26 Render li elements w/ innerHTML 5:17:37 Use createElement() & append() instead of innerHTML 5:21:16 Improving performance of our app 5:24:37 Create render function 5:26:40 Clear input field 5:28:47 Add a tag 5:35:53 Template strings 5:35:54 Write template string 5:36:28 Make template string more dynamic 5:37:12 Template strings on multiple lines 5:41:03 Refactor app to use template string 5:42:19 Style list 5:46:13 Preparing deployment 5:51:08 Deploying Chrome Extension 5:53:40 What is localStorage? 5:56:45 First localStorage 6:00:38 Storing arrays in localStorage 6:07:05 Save leads 6:09:36 Get leads 6:13:31 Truthy & falsy values 6:21:28 Guess expression: truthy or falsy? 6:23:52 Checking localStorage before rendering 6:27:33 Style delete button 6:30:52 Make delete button work 6:35:12 How function parameters can improve our code 6:41:09 Write function parameter 6:44:40 Functions w/ multiple params 6:47:54 Numbers as function params 6:49:40 Arguments vs Params 6:53:06 Arrays as params 6:55:02 Refactor renderLeads() to use parameter 6:56:46 Create tabBtn 7:00:07 Save tab url 7:02:46 Get current tab 7:07:09 Use Chrome API to get tab 7:13:32 Deploy final version 7:15:48 Recap 7:21:34 Practice 7:41:55 Outro
18
Per Harald Borgen, you are an amazing teacher. This is the first course I finished completely. The way you teach JS With DOM there are very few people who can do that. Many people learn JS like me but don't really know how to use it on browsers and that is a pain point. Thank you soo much. Wish to meet you some day and thank you in person. ❤
13
One of the best courses I have had the chance to watch. Almost 8hours but completely worth it. Other teachers were kind of boring but Per really takes his time and explains how and why he uses his code. I like that. Getting to Scrimba to follow the Front end engineer career path.
14
Such a good course. So many tutorials lack practice tasks but yours is full of them which helps cement understanding
4
I have just finished this course, and I honestly loved it. It is really good for absolute beginners with 0 knowledge of coding. It is also one of those tutorials that you won't really get stuck at because it is not confusing, the instructions are very clear, and I didn't need to use google much to figure out stuff since this was not a very complex video. So again, thank you guys for this video. It truly helped me learn about JS and I wish to see more videos like this.
3
How can one person be this good in coding and also In teaching? I hope you realize you are a multiple dose of blessings to this generation. Thank you Per Borgen !
15

Intro

0:00

Passenger counter app

3:41

Setting up file

4:39

Create variable

7:42

Mathematical operations

12:27

Reassigning & incrementing

16:16

Adding button

19:23

onclick event listener

21:41

Using functions to write less code

25:10

First function

28:48

Function that logs sum

29:34

Function that increments

32:25

Increment on clicks

34:23

Display count

36:35

Document Object Model

41:53

Display count w/ innerText

43:47

Create save button

44:30

What is string?

46:40

First string variable

48:16

Log greeting to console

52:00

Strings vs. Numbers

53:18

Build Blackjack game

1:31:27

Add firstCard, secondCard, & sum

1:32:27

If...else conditionals

1:33:23

if...else statement

1:39:08

if/else...if/else statement

1:42:05

if...else statement for our game

1:45:28

hasBlackJack variable

1:47:32

isAlive variable

1:49:38

Practice boolean conditions

1:51:27

Add message variable

1:54:55

Link stylesheet

1:58:20

Add basic styling

2:00:56

Make start button work

2:05:19

Display message

2:11:13

Display sum

2:13:48

Display cards

2:19:36

New card button

2:21:34

Add to sum when newCard is clicked

2:25:16

Rename startGame function

2:28:36

Solving our cards problem w/ array

2:30:52

Arrays intro

2:34:12

Array indexes

2:39:30

Arrays w/ multiple data types

2:43:50

Adding & removing items from arrays

2:46:12

Creating cards array

2:50:35

Push new card to array

2:51:43

Counting

2:53:05

Loops

2:57:10

For loops & arrays

3:00:37

First array-based for loop

3:04:23

For loops, arrays, & DOM

3:05:55

Use loop to render cards

3:08:55

Avoid hard-coding values

3:11:16

Returning values

3:12:51

Use function to set card values

3:17:54

Generating random numbers w/ Math.random()

3:21:05

Math.random() * 6

3:25:24

Flooring number w/ Math.floor()

3:27:11

Create dice

3:28:40

Completing dice function

3:30:23

Make getRandomCard() work

3:33:04

getRandomNumber function

3:36:00

Assign values in startGame function

3:39:06

Card feature is broken

3:41:52

Logical AND operator

3:42:54

Logical operators

3:46:39

logical OR operator

3:48:47

Only trigger newCard() if you're allowed to

3:51:52

Build Chrome Extension

4:33:54

Add button & input tag

4:38:30

Style button & input tag

4:40:06

Make input button work w/ onclick

4:47:28

Refactor to addEventListener

4:48:49

addEventListener()

4:51:11

Refactoring

4:52:58

Create myLeads array & inputEl

4:54:25

Using let & const

4:56:49

Push to myLeads array

5:00:11

Push value from input field

5:01:24

Use for loop to log out leads

5:03:56

Create unordered list

5:05:38

Render leads in unordered list

5:07:39

How to render li elements w/ innerHTML

5:11:22

innerHTML

5:13:01

More innerHTML practice

5:14:34

Render li elements w/ innerHTML

5:16:26

Use createElement() & append() instead of innerHTML

5:17:37

Improving performance of our app

5:21:16

Create render function

5:24:37

Clear input field

5:26:40

Add a tag

5:28:47

Write template string

5:35:54

Make template string more dynamic

5:36:28

Template strings on multiple lines

5:37:12

Refactor app to use template string

5:41:03

Style list

5:42:19

Preparing deployment

5:46:13
JavaScript Programming - Full Course
freeCodeCamp.org
66K Likes
2,683,533 Views
2021 Jun 21
Learn JavaScript from scratch by solving over a hundred different coding challenges. Go here for the interactive browser version: https://scrimba.com/learn/learnjavasc... ⭐️ Code ⭐️ Two versions: 🔗 Interactive version: https://scrimba.com/learn/learnjavasc... 🔗 GitHub repo: https://github.com/scrimba/learn-java... ✏️ Created by Per Harald Borgen. Per on Twitter: https://twitter.com/perborgen 00:00 Intro 03:41 Passenger counter app 04:39 Setting up file 07:42 Create variable 12:27 Mathematical operations 16:16 Reassigning & incrementing 19:23 Adding button 21:41 onclick event listener 25:10 Using functions to write less code 28:48 First function 29:34 Function that logs sum 32:25 Function that increments 34:23 Increment on clicks 36:35 Display count 41:53 Document Object Model 43:47 Display count w/ innerText 44:30 Create save button 46:40 What is string? 48:16 First string variable 52:00 Log greeting to console 53:18 Strings vs. Numbers Render welcome message Improve message w/ string concatenation Use plus equal for count Create save feature Debugging online Set count to 0 Recap Variables practice Concatenate strings Incrementing & decrementing Strings & numbers Rendering error message Calculator challenge Build Blackjack Game 1:31:27 Build Blackjack game 1:32:27 Add firstCard, secondCard, & sum 1:33:23 If...else conditionals 1:39:08 if...else statement 1:42:05 if/else...if/else statement 1:45:28 if...else statement for our game 1:47:32 hasBlackJack variable 1:49:38 isAlive variable 1:51:27 Practice boolean conditions 1:54:55 Add message variable 1:58:20 Link stylesheet 2:00:56 Add basic styling 2:05:19 Make start button work 2:11:13 Display message 2:13:48 Display sum 2:19:36 Display cards 2:21:34 New card button 2:25:16 Add to sum when newCard is clicked 2:28:36 Rename startGame function 2:30:52 Solving our cards problem w/ array 2:34:12 Arrays intro 2:39:30 Array indexes 2:43:50 Arrays w/ multiple data types 2:46:12 Adding & removing items from arrays 2:50:35 Creating cards array 2:51:43 Push new card to array 2:53:05 Counting 2:57:10 Loops 3:00:37 For loops & arrays 3:04:23 First array-based for loop 3:05:55 For loops, arrays, & DOM 3:08:55 Use loop to render cards 3:11:16 Avoid hard-coding values 3:12:51 Returning values 3:17:54 Use function to set card values 3:21:05 Generating random numbers w/ Math.random() 3:25:24 Math.random() * 6 3:27:11 Flooring number w/ Math.floor() 3:28:40 Create dice 3:30:23 Completing dice function 3:33:04 Make getRandomCard() work 3:36:00 getRandomNumber function 3:39:06 Assign values in startGame function 3:41:52 Card feature is broken 3:42:54 Logical AND operator 3:46:39 Logical operators 3:48:47 logical OR operator 3:51:52 Only trigger newCard() if you're allowed to Object sneak peek Objects Create first object Store player data Methods on object Recap Objects & functions if else Loops & arrays push, pop, unshift, shift challenge Logical operators Rock papers scissors Sorting fruits Build Chrome Extension 4:33:54 Build Chrome Extension 4:38:30 Add button & input tag 4:40:06 Style button & input tag 4:47:28 Make input button work w/ onclick 4:48:49 Refactor to addEventListener 4:51:11 addEventListener() 4:52:58 Refactoring 4:54:25 Create myLeads array & inputEl 4:56:49 Using let & const 5:00:11 Push to myLeads array 5:01:24 Push value from input field 5:03:56 Use for loop to log out leads 5:05:38 Create unordered list 5:07:39 Render leads in unordered list 5:11:22 How to render li elements w/ innerHTML 5:13:01 innerHTML 5:14:34 More innerHTML practice 5:16:26 Render li elements w/ innerHTML 5:17:37 Use createElement() & append() instead of innerHTML 5:21:16 Improving performance of our app 5:24:37 Create render function 5:26:40 Clear input field 5:28:47 Add a tag 5:35:53 Template strings 5:35:54 Write template string 5:36:28 Make template string more dynamic 5:37:12 Template strings on multiple lines 5:41:03 Refactor app to use template string 5:42:19 Style list 5:46:13 Preparing deployment Deploying Chrome Extension What is localStorage? First localStorage Storing arrays in localStorage Save leads Get leads Truthy & falsy values Guess expression: truthy or falsy? Checking localStorage before rendering Style delete button Make delete button work How function parameters can improve our code Write function parameter Functions w/ multiple params Numbers as function params Arguments vs Params Arrays as params Refactor renderLeads() to use parameter Create tabBtn Save tab url Get current tab Use Chrome API to get tab Deploy final version Recap Practice Outro